{"componentChunkName":"component---src-components-details-template-js","path":"/components/CNav/","result":{"data":{"site":{"siteMetadata":{"ver":"3.0"}},"allFile":{"nodes":[{"id":"21d4ccb8-23e7-551c-9dde-7f9c6fcf7ee5","name":"CAlert","fields":{"code":"import React, { useState, useEffect, useRef } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport CFade from '../fade/CFade'\r\nimport { omitByKeys } from '@coreui/utils/src'\r\nimport { CFadeProps } from '../utils/helper.js'\r\nimport CButtonClose from '../button/CButtonClose'\r\n\r\n//component - CoreUI / CAlert\r\nconst CAlert = props => {\r\n let {\r\n children,\r\n className,\r\n //\r\n onShowChange,\r\n closeButton,\r\n color,\r\n fade,\r\n show,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n const classes = classNames(\r\n className,\r\n 'alert',\r\n {\r\n [`alert-${color}`]: color,\r\n 'alert-dismissible': closeButton\r\n }\r\n )\r\n\r\n const alertTransition = {\r\n baseClass: fade ? CFade.baseClass : '',\r\n timeout: fade ? CFade.timeout : 0,\r\n unmountOnExit: true\r\n }\r\n \r\n const [isOpen, setIsOpen] = useState(show)\r\n\r\n useEffect(() => {\r\n setIsOpen(show)\r\n }, [show])\r\n\r\n let timeout = useRef()\r\n\r\n useEffect(() => {\r\n onShowChange && onShowChange(isOpen)\r\n clearTimeout(timeout.current)\r\n if (typeof isOpen === 'number' && isOpen > 0) {\r\n timeout.current = setTimeout(() => {\r\n setIsOpen(isOpen - 1)\r\n }, 1000)\r\n }\r\n return () => clearTimeout(timeout.current)\r\n }, [isOpen])\r\n\r\n const attrs = omitByKeys(attributes, CFadeProps)\r\n\r\n return (\r\n \r\n { children }\r\n { closeButton && setIsOpen(false)} />}\r\n \r\n )\r\n}\r\n\r\nCAlert.propTypes = {\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n onShowChange: PropTypes.func,\r\n closeButton: PropTypes.bool,\r\n color: PropTypes.string,\r\n fade: PropTypes.bool,\r\n show: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]),\r\n};\r\n\r\nCAlert.defaultProps = {\r\n show: true,\r\n fade: true\r\n};\r\n\r\nexport default CAlert\r\n"}},{"id":"5fd2c6ef-f2d8-5dff-9ae5-d2f3b027d704","name":"CBadge","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\nimport CLink from '../link/CLink'\r\n\r\n//component - CoreUI / CBadge\r\n\r\nconst CBadge = props => {\r\n\r\n let {\r\n tag,\r\n className,\r\n //\r\n innerRef,\r\n color,\r\n shape,\r\n ...attributes\r\n } = props\r\n\r\n // render\r\n\r\n const classes = classNames(\r\n className,\r\n 'badge',\r\n {\r\n [`badge-${color}`]: color,\r\n [`badge-${shape}`]: shape\r\n }\r\n )\r\n\r\n const Tag = attributes.to || attributes.href ? CLink : tag\r\n const ref = { [`${typeof Tag === 'string' ? 'ref': 'innerRef'}`]: innerRef }\r\n\r\n return (\r\n \r\n )\r\n\r\n}\r\n\r\nCBadge.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n color: PropTypes.string,\r\n shape: PropTypes.oneOf(['', 'pill'])\r\n};\r\n\r\nCBadge.defaultProps = {\r\n tag: 'span'\r\n}\r\n\r\nexport default CBadge\r\n"}},{"id":"776a09b8-6e1d-593d-8267-deb99c7cb6f9","name":"CBrand","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from './helper.js'\r\nimport CLink from '../link/CLink'\r\n\r\n//component - CoreUI / CBrand\r\nconst CBrand = props => {\r\n\r\n const {\r\n tag,\r\n className,\r\n //\r\n innerRef,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(className)\r\n\r\n const Tag = attributes.to || attributes.href ? CLink : tag\r\n const ref = { [`${typeof Tag === 'string' ? 'ref': 'innerRef'}`]: innerRef}\r\n return (\r\n \r\n )\r\n}\r\n\r\nCBrand.propTypes = {\r\n tag: tagPropType,\r\n children: PropTypes.node,\r\n className: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string])\r\n};\r\n\r\nCBrand.defaultProps = {\r\n tag: 'div'\r\n};\r\n\r\nexport default CBrand\r\n"}},{"id":"cf0244ae-1fb3-5d34-bad4-f26c4981b1cb","name":"CBreadcrumb","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CBreadcrumb\r\n\r\nconst CBreadcrumb = props => {\r\n\r\n const {\r\n className,\r\n innerRef,\r\n //\r\n ...attributes\r\n } = props\r\n\r\n const classes = classNames(className, 'breadcrumb')\r\n\r\n //render\r\n return (\r\n
    \r\n )\r\n}\r\n\r\nCBreadcrumb.propTypes = {\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n}\r\n\r\nexport default CBreadcrumb"}},{"id":"d634ef42-7d56-50d0-a08d-8bece04c72f3","name":"CBreadcrumbItem","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CBreadcrumbItem\r\n\r\nconst CBreadcrumbItem = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n active,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n active ? 'active' : false,\r\n 'breadcrumb-item'\r\n )\r\n\r\n return (\r\n
  1. \r\n )\r\n\r\n}\r\n\r\nCBreadcrumbItem.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n active: PropTypes.bool\r\n}\r\n\r\nexport default CBreadcrumbItem"}},{"id":"0d0c115d-c293-5bac-b4ca-e3d092bb22f6","name":"CBreadcrumbRouter","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { CBreadcrumb, CBreadcrumbItem } from '../index'\r\nimport { Link, useLocation } from 'react-router-dom';\r\n\r\n//component - CoreUI / CBreadcrumbRouter\r\n\r\nconst getPaths = pathname => {\r\n const paths = ['/']\r\n if (pathname === '/') return paths;\r\n pathname.split('/').reduce((prev, curr) => {\r\n const currPath = `${prev}/${curr}`\r\n paths.push(currPath)\r\n return currPath\r\n })\r\n return paths\r\n}\r\n\r\nconst CBreadcrumbRouteItem = ({name, path}, currPath) => {\r\n if (path === currPath) {\r\n return {name}\r\n } else {\r\n return \r\n \r\n {name}\r\n \r\n \r\n }\r\n}\r\n\r\nconst CBreadcrumbRouter = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n routes,\r\n ...attributes\r\n } = props;\r\n\r\n let items = null\r\n if (routes) {\r\n const currPath = useLocation().pathname\r\n const paths = getPaths(currPath)\r\n const currRoutes = routes.filter(route => paths.includes(route.path))\r\n items = currRoutes.map(route => {\r\n return CBreadcrumbRouteItem(route, currPath)\r\n })\r\n }\r\n\r\n\r\n //render\r\n\r\n const classes = classNames(className)\r\n\r\n return (\r\n \r\n {items}\r\n \r\n )\r\n}\r\n\r\nCBreadcrumbRouter.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n routes: PropTypes.array\r\n}\r\n\r\nexport default CBreadcrumbRouter"}},{"id":"cf52d5cb-4ed4-5ab4-9831-9d410c381208","name":"CButton","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\nimport CLink from '../link/CLink'\r\n//component - CoreUI / CButton\r\n\r\nconst CButton = props => {\r\n\r\n let {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n onClick,\r\n disabled,\r\n active,\r\n block,\r\n color,\r\n size,\r\n pressed,\r\n shape,\r\n variant,\r\n ...attributes\r\n } = props\r\n\r\n const click = e => !disabled && onClick && onClick(e)\r\n\r\n const isLink = attributes.to || attributes.href\r\n\r\n //render\r\n const classes = classNames(\r\n className,\r\n 'btn',\r\n variant || color ? `btn${variant ? '-' + variant : ''}-${color}` : false,\r\n size ? `btn-${size}` : false,\r\n block ? 'btn-block' : false,\r\n shape ? `btn-${shape}` : false,\r\n pressed ? 'btn-pressed' : false,\r\n { 'active': active && !isLink,\r\n 'disabled': disabled && !isLink }\r\n )\r\n\r\n\r\n if (isLink) {\r\n return \r\n } else {\r\n return \r\n }\r\n}\r\n\r\nCButton.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n active: PropTypes.bool,\r\n block: PropTypes.bool,\r\n shape: PropTypes.string,\r\n variant: PropTypes.oneOf(['', 'ghost', 'outline']),\r\n color: PropTypes.string,\r\n disabled: PropTypes.bool,\r\n onClick: PropTypes.func,\r\n size: PropTypes.string,\r\n pressed: PropTypes.bool,\r\n}\r\n\r\nCButton.defaultProps = {\r\n tag: 'button'\r\n}\r\n\r\n//export\r\nexport default CButton\r\n"}},{"id":"3165e993-3595-525a-adfb-260ef72eb4d1","name":"CButtonClose","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CButtonClose\r\n\r\nconst CButtonClose = props => {\r\n\r\n const {\r\n children,\r\n className,\r\n //\r\n buttonClass,\r\n innerRef,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n buttonClass,\r\n className\r\n )\r\n\r\n return (\r\n \r\n { children || String.fromCharCode(215) }\r\n \r\n )\r\n\r\n}\r\n\r\nCButtonClose.propTypes = {\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n buttonClass: PropTypes.string,\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n}\r\n\r\nCButtonClose.defaultProps = {\r\n buttonClass: 'close'\r\n}\r\n\r\nexport default CButtonClose\r\n"}},{"id":"19ef5f16-4fd9-5c51-ae10-848297379bae","name":"CButtonGroup","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CButtonGroup\r\n\r\nconst CButtonGroup = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n size,\r\n vertical,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n size ? 'btn-group-' + size : false,\r\n vertical ? 'btn-group-vertical' : 'btn-group'\r\n )\r\n\r\n return (\r\n
    \r\n )\r\n}\r\n\r\nCButtonGroup.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n size: PropTypes.oneOf(['', 'sm', 'lg']),\r\n vertical: PropTypes.bool\r\n}\r\n\r\n\r\nexport default CButtonGroup\r\n"}},{"id":"50cdcf0b-70ba-577b-8c56-7e1eff40c910","name":"CButtonToolbar","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CButtonToolbar\r\n\r\nconst CButtonToolbar = props=>{\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n justify,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'btn-toolbar',\r\n { [`justify-content-${justify}`]: justify }\r\n )\r\n\r\n return (\r\n
    \r\n )\r\n\r\n}\r\n\r\nCButtonToolbar.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n role: PropTypes.string,\r\n justify: PropTypes.oneOf(['', 'start', 'end', 'between', 'center'])\r\n}\r\n\r\nexport default CButtonToolbar\r\n"}},{"id":"785dfb35-7c63-5378-9bc6-41cfcf9d3eef","name":"CCallout","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CCallout\r\n\r\nconst CCallout = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n color,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n 'c-callout',\r\n color ? 'c-callout-' + color : null,\r\n className\r\n )\r\n\r\n return (\r\n
    \r\n )\r\n\r\n}\r\n\r\nCCallout.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n color: PropTypes.string\r\n}\r\n\r\nexport default CCallout\r\n"}},{"id":"6fde2579-3d90-539e-bebe-1793e06f8311","name":"CCard","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\n\r\n//component - CoreUI / CCard\r\n\r\nconst CCard = props => {\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n color,\r\n textColor,\r\n borderColor,\r\n align,\r\n accentColor,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'card',\r\n align ? `text-${align}` : false,\r\n textColor ? `text-${textColor}` : false,\r\n color ? `bg-${color}` : false,\r\n borderColor ? `border-${borderColor}` : false,\r\n accentColor ? `card-accent-${accentColor}` : false,\r\n )\r\n\r\n\r\n return (\r\n \r\n )\r\n}\r\n\r\nexport const sharedPropTypes = {\r\n align: PropTypes.oneOf(['', 'left', 'center', 'right']),\r\n color: PropTypes.string,\r\n borderColor: PropTypes.string,\r\n textColor: PropTypes.string\r\n}\r\n\r\nCCard.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n accentColor: PropTypes.string,\r\n ...sharedPropTypes\r\n}\r\n\r\nCCard.defaultProps = {\r\n tag: 'div'\r\n}\r\n\r\nexport default CCard\r\n"}},{"id":"a84c4cfd-dabb-5c0f-9927-2576e4720f1f","name":"CCardBody","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\nimport { sharedPropTypes } from './CCard'\r\n//component - CoreUI / CCardBody\r\n\r\nconst CCardBody = props => {\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n color,\r\n textColor,\r\n borderColor,\r\n align,\r\n ...attributes\r\n } = props\r\n\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'card-body',\r\n align ? `text-${align}` : false,\r\n textColor ? `text-${textColor}` : false,\r\n color ? `bg-${color}` : false,\r\n borderColor ? `border-${borderColor}` : false\r\n )\r\n\r\n return (\r\n \r\n )\r\n\r\n}\r\n\r\nCCardBody.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n ...sharedPropTypes\r\n}\r\n\r\nCCardBody.defaultProps = {\r\n tag: 'div'\r\n}\r\n\r\nexport default CCardBody\r\n"}},{"id":"6ba23322-3114-5bcc-badb-fa5cd6eb88c0","name":"CCardFooter","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\nimport { sharedPropTypes } from './CCard.js'\r\n\r\n//component - CoreUI / CCardFooter\r\n\r\nconst CCardFooter = props => {\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n color,\r\n textColor,\r\n borderColor,\r\n align,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'card-footer',\r\n align ? `text-${align}` : false,\r\n textColor ? `text-${textColor}` : false,\r\n color ? `bg-${color}` : false,\r\n borderColor ? `border-${borderColor}` : false\r\n )\r\n\r\n return (\r\n \r\n )\r\n\r\n}\r\n\r\nCCardFooter.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n ...sharedPropTypes\r\n}\r\n\r\nCCardFooter.defaultProps = {\r\n tag: 'footer'\r\n}\r\n\r\nexport default CCardFooter\r\n"}},{"id":"bb27d026-c34f-5aec-96dd-b1b611d451e7","name":"CCardGroup","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport {tagPropType} from '../utils/helper.js'\r\n\r\n//component - CoreUI / CCardGroup\r\n\r\nconst CCardGroup = props=>{\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n deck,\r\n columns,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n `card-${columns ? 'columns' : deck ? 'deck' : 'group' }`,\r\n className\r\n )\r\n\r\n return (\r\n \r\n )\r\n\r\n}\r\n\r\nCCardGroup.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n deck: PropTypes.bool,\r\n columns: PropTypes.bool,\r\n}\r\n\r\nCCardGroup.defaultProps = {\r\n tag: 'div'\r\n}\r\n\r\nexport default CCardGroup\r\n"}},{"id":"7b2c4dc0-1b9e-5c4c-87c6-4545b666660d","name":"CCardHeader","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\nimport { sharedPropTypes } from './CCard'\r\n\r\n//component - CoreUI / CCardHeader\r\n\r\nconst CCardHeader = props => {\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n innerRef,\r\n color,\r\n textColor,\r\n borderColor,\r\n align,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'card-header',\r\n align ? `text-${align}` : false,\r\n textColor ? `text-${textColor}` : false,\r\n color ? `bg-${color}` : false,\r\n borderColor ? `border-${borderColor}` : false\r\n )\r\n\r\n return (\r\n \r\n )\r\n\r\n}\r\n\r\nCCardHeader.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n ...sharedPropTypes\r\n}\r\n\r\nCCardHeader.defaultProps = {\r\n tag: 'header'\r\n}\r\n\r\nexport default CCardHeader\r\n"}},{"id":"9f39da64-ec26-5ce4-835f-56a8be7b7b3b","name":"CCardImg","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport CImg from '../image/CImg'\r\n\r\n//component - CoreUI / CCardImg\r\nconst CCardImg = props => {\r\n const { variant, ...rest } = props\r\n const classSuffix = variant !== 'full' ? `-${variant}` : ''\r\n return (\r\n \r\n )\r\n}\r\n\r\nCCardImg.propTypes = {\r\n variant: PropTypes.oneOf(['', 'top', 'bottom', 'full'])\r\n}\r\n\r\nCCardImg.defaultProps = {\r\n variant: 'full'\r\n}\r\n\r\nexport default CCardImg\r\n"}},{"id":"b703760b-4fbc-50c6-ab2b-e8df659e08bb","name":"CCardImgOverlay","fields":{"code":"import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport {tagPropType} from '../utils/helper.js';\r\n\r\n//component - CoreUI / CCardImgOverlay\r\n\r\nconst CCardImgOverlay = props=>{\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n ...attributes\r\n } = props;\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'card-img-overlay'\r\n );\r\n\r\n return (\r\n \r\n );\r\n\r\n}\r\n\r\nCCardImgOverlay.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n};\r\n\r\nCCardImgOverlay.defaultProps = {\r\n tag: 'div'\r\n};\r\n\r\nexport default CCardImgOverlay;\r\n"}},{"id":"10285697-3326-5e29-9a79-f4e3d9592638","name":"CCardLink","fields":{"code":"/* eslint react/prop-types: 0 */\r\nimport React from 'react'\r\nimport CLink from '../link/CLink'\r\n\r\nconst CCardLink = props => {\r\n return (\r\n \r\n )\r\n}\r\n\r\nexport default CCardLink\r\n"}},{"id":"716f0d10-c1f0-5518-aba2-6cd323945546","name":"CCardSubtitle","fields":{"code":"import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport {tagPropType} from '../utils/helper.js';\r\n\r\n//component - CoreUI / CCardSubtitle\r\n\r\nconst CCardSubtitle = props=>{\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n ...attributes\r\n } = props;\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'card-subtitle'\r\n );\r\n\r\n return (\r\n \r\n );\r\n\r\n}\r\n\r\nCCardSubtitle.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n};\r\n\r\nCCardSubtitle.defaultProps = {\r\n tag: 'h6'\r\n};\r\n\r\nexport default CCardSubtitle;\r\n"}},{"id":"3a42900d-f436-5dbc-8705-944d97465f90","name":"CCardText","fields":{"code":"import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport {tagPropType} from '../utils/helper.js';\r\n\r\n//component - CoreUI / CCardText\r\n\r\nconst CCardText = props=>{\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n ...attributes\r\n } = props;\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'card-text'\r\n );\r\n\r\n return (\r\n \r\n );\r\n\r\n}\r\n\r\nCCardText.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n};\r\n\r\nCCardText.defaultProps = {\r\n tag: 'p'\r\n};\r\n\r\nexport default CCardText;\r\n"}},{"id":"74b8aa9c-3e9f-5933-9f9b-11fe79309c8b","name":"CCardTitle","fields":{"code":"import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport {tagPropType} from '../utils/helper.js';\r\n\r\n//component - CoreUI / CCardTitle\r\n\r\nconst CCardTitle = props=>{\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n innerRef,\r\n ...attributes\r\n } = props;\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'card-title'\r\n );\r\n\r\n return (\r\n \r\n );\r\n\r\n}\r\n\r\nCCardTitle.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n};\r\n\r\nCCardTitle.defaultProps = {\r\n tag: 'h4'\r\n};\r\n\r\nexport default CCardTitle;\r\n"}},{"id":"daab77a8-3460-53ae-89b1-208e419f984f","name":"CCarousel","fields":{"code":"import React, { useState, useRef, useEffect } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\nexport const Context = React.createContext({});\r\n\r\n//component - CoreUI / CCarousel\r\n\r\nconst CCarousel = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n autoSlide,\r\n activeIndex,\r\n animate,\r\n onSlideChange,\r\n ...attributes\r\n } = props;\r\n\r\n const [state, setState] = useState([null, activeIndex])\r\n const [itemNumber, setItemNumber] = useState(null)\r\n const [animating, setAnimating] = useState()\r\n\r\n useEffect(() => {\r\n setState([state[1], activeIndex])\r\n }, [activeIndex])\r\n\r\n const timeout = useRef()\r\n\r\n const setNext = () => {\r\n reset()\r\n if (autoSlide) {\r\n timeout.current = setTimeout(() => nextItem(), autoSlide)\r\n } \r\n }\r\n const reset = () => clearTimeout(timeout.current)\r\n const nextItem = () => {\r\n setState([state[1], itemNumber === state[1] + 1 ? 0 : state[1] + 1, 'next'])\r\n }\r\n\r\n useEffect(() => {\r\n onSlideChange && onSlideChange(state[1])\r\n setNext()\r\n return () => reset()\r\n }, [state])\r\n\r\n\r\n const classes = classNames('carousel', className)\r\n return (\r\n \r\n \r\n {props.children}\r\n \r\n
    \r\n )\r\n}\r\n\r\nCCarousel.propTypes = {\r\n className: PropTypes.string,\r\n children: PropTypes.array,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n activeIndex: PropTypes.number,\r\n autoSlide: PropTypes.number,\r\n animate: PropTypes.bool,\r\n onSlideChange: PropTypes.func\r\n};\r\n\r\nCCarousel.defaultProps = {\r\n activeIndex: 0\r\n};\r\n\r\nexport default CCarousel\r\n"}},{"id":"604f0015-e18c-5fa4-90bf-335edb377cca","name":"CCarouselCaption","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CCarouselCaption\r\n\r\nconst CCarouselCaption = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n ...attributes\r\n } = props;\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n 'carousel-caption',\r\n className\r\n )\r\n\r\n return (\r\n
    \r\n )\r\n}\r\n\r\nCCarouselCaption.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string])\r\n};\r\n\r\nexport default CCarouselCaption\r\n"}},{"id":"bfaaae45-9328-5efc-8d30-01b02ee02cae","name":"CCarouselControl","fields":{"code":"import React, { useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\n\r\nimport { Context } from './CCarousel'\r\n\r\n//component - CoreUI / CCarouselControl\r\n\r\nconst CCarouselControl = props => {\r\n\r\n const {\r\n className,\r\n children,\r\n //\r\n innerRef,\r\n direction,\r\n ...attributes\r\n } = props\r\n\r\n const { state, setState, itemNumber, animating } = useContext(Context)\r\n\r\n const onClick = () => {\r\n if (animating) {\r\n return\r\n }\r\n let newIdx\r\n if (direction === 'next') {\r\n newIdx = itemNumber === state[1] + 1 ? 0 : state[1] + 1\r\n } else {\r\n newIdx = state[1] === 0 ? itemNumber - 1 : state[1] - 1\r\n }\r\n setState([state[1], newIdx, direction])\r\n }\r\n\r\n //render\r\n\r\n const anchorClasses = classNames(\r\n `carousel-control-${direction}`, className,\r\n )\r\n\r\n return (\r\n \r\n { children || }\r\n \r\n )\r\n}\r\n\r\nCCarouselControl.propTypes = {\r\n className: PropTypes.string,\r\n children: PropTypes.node,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n direction: PropTypes.oneOf(['prev', 'next']).isRequired,\r\n};\r\n\r\nexport default CCarouselControl\r\n"}},{"id":"0501ec36-06a9-5e70-bb34-8e2971979c7f","name":"CCarouselIndicators","fields":{"code":"import React, { useContext } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\nimport { Context } from './CCarousel'\r\n//component - CoreUI / CCarouselIndicators\r\n\r\nconst CCarouselIndicators = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n indicatorsClass,\r\n ...attributes\r\n } = props\r\n\r\n const { itemNumber, state, setState, animating } = useContext(Context)\r\n\r\n //render\r\n const listClasses = classNames(\r\n indicatorsClass, className\r\n )\r\n\r\n const indicators = Array.from({length: itemNumber}, (_, i) => i).map(key => {\r\n return (\r\n {\r\n !animating && key !== state[1] && setState([state[1], key])\r\n }}\r\n className={state[1] === key ? 'active' : ''}\r\n />)\r\n })\r\n\r\n return (\r\n
      \r\n {indicators}\r\n
    \r\n )\r\n}\r\n\r\nCCarouselIndicators.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n indicatorsClass: PropTypes.string\r\n};\r\n\r\nCCarouselIndicators.defaultProps = {\r\n indicatorsClass: 'carousel-indicators'\r\n};\r\n\r\nexport default CCarouselIndicators\r\n"}},{"id":"29f7e94f-545a-5a1a-862e-95fbe868860f","name":"CCarouselInner","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CCarouselInner\r\n\r\nconst CCarouselInner = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n ...attributes\r\n } = props;\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n 'carousel-inner',\r\n className\r\n )\r\n\r\n return (\r\n
    \r\n )\r\n}\r\n\r\nCCarouselInner.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string])\r\n};\r\n\r\nexport default CCarouselInner\r\n"}},{"id":"c05d0ae6-7725-5330-811e-8723908a773a","name":"CCarouselItem","fields":{"code":"import React, { useState, useContext, createRef, useEffect } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { Transition } from 'react-transition-group'\r\nimport { Context } from './CCarousel'\r\n\r\n//component - CoreUI / CCarouselItem\r\nconst getIndex = (el) => Array.from(el.parentNode.children).indexOf(el)\r\n\r\nconst getDirection = (state) => {\r\n if (state[2]) {\r\n return state[2] === 'next' ? 'right' : 'left'\r\n } else {\r\n return state[1] > state[0] ? 'right' : 'left'\r\n }\r\n}\r\n\r\nconst CCarouselItem = props => {\r\n\r\n const {\r\n children,\r\n className,\r\n //\r\n innerRef,\r\n ...attributes\r\n } = props;\r\n\r\n const {\r\n animate,\r\n state,\r\n itemNumber,\r\n setItemNumber,\r\n animating,\r\n setAnimating\r\n } = useContext(Context)\r\n\r\n const ref = createRef()\r\n innerRef && innerRef(ref)\r\n const [isIn, setIsIn] = useState()\r\n\r\n useEffect(() => {\r\n if (!itemNumber) {\r\n setItemNumber(ref.current.parentNode.children.length)\r\n }\r\n setIsIn(state[1] === getIndex(ref.current))\r\n }, [state])\r\n\r\n const onEnter = () => {\r\n setAnimating(false)\r\n }\r\n\r\n const onEntering = (node) => {\r\n /* eslint-disable no-unused-vars */\r\n const offsetHeight = node.offsetHeight\r\n setAnimating(true)\r\n /* eslint-enable no-unused-vars */\r\n }\r\n\r\n const onExit = () => {\r\n setAnimating(false)\r\n }\r\n\r\n const onExiting = () => {\r\n setAnimating(true)\r\n }\r\n\r\n const onExited = () => {\r\n setAnimating(false)\r\n }\r\n\r\n\r\n //render\r\n if (!animate || state[0] === null) {\r\n const itemClasses = classNames(\r\n 'carousel-item',\r\n isIn && 'active',\r\n className,\r\n )\r\n return (\r\n
    \r\n {children}\r\n
    \r\n )\r\n }\r\n\r\n return (\r\n \r\n {(status) => {\r\n const direction = getDirection(state)\r\n const isActive = (status === 'entered') || (status === 'exiting')\r\n const directionClassName = (status === 'entering' || status === 'exiting') &&\r\n animating &&\r\n (direction === 'right' ? 'carousel-item-left' : 'carousel-item-right')\r\n\r\n const orderClassName = (status === 'entering') &&\r\n (direction === 'right' ? 'carousel-item-next' : 'carousel-item-prev')\r\n\r\n const itemClasses = classNames(\r\n 'carousel-item',\r\n isActive && 'active',\r\n directionClassName,\r\n orderClassName,\r\n className,\r\n )\r\n\r\n return (\r\n
    \r\n {children}\r\n
    \r\n )\r\n }}\r\n \r\n )\r\n\r\n}\r\n\r\nCCarouselItem.propTypes = {\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n};\r\n\r\nexport default CCarouselItem\r\n"}},{"id":"5415ed19-5ab2-55b2-9c26-ab3e23924f6a","name":"CChart","fields":{"code":"import React, { useState, useEffect, useRef, useMemo } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport Chart from 'chart.js'\r\nimport { customTooltips as cuiCustomTooltips } from '@coreui/chartjs'\r\nimport '@coreui/chartjs/dist/css/coreui-chartjs.css'\r\n\r\nconst months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']\r\nconst key = () => Math.random().toString(36).replace('0.', '')\r\n\r\n//component - CoreUI / CChart\r\nconst CChart = props => {\r\n const {\r\n innerRef,\r\n datasets,\r\n labels,\r\n options,\r\n plugins,\r\n type,\r\n ...attributes\r\n } = props\r\n\r\n const compData = useRef({ firstRun: true }).current\r\n const [chart, setChart] = useState()\r\n const ref = useRef()\r\n const safeId = useState('safe_id_' + key())[0]\r\n\r\n // methods\r\n const renderChart = () => {\r\n destroyChart()\r\n setChart(new Chart(\r\n ref.current.getContext('2d'),\r\n chartConfig\r\n ))\r\n }\r\n\r\n const updateChart = () => {\r\n Object.assign(chart, chartConfig)\r\n chart.update()\r\n }\r\n\r\n const destroyChart = () => chart && chart.destroy()\r\n\r\n const dataset = (datasets && datasets[0] && datasets[0].data) || []\r\n\r\n const computedLabels = useMemo(() => {\r\n if (labels && typeof labels !== 'string') {\r\n return labels\r\n }\r\n const emptyLabels = Array(dataset.length).fill('')\r\n if (labels === 'indexes') {\r\n return emptyLabels.map((u, i) => i + 1)\r\n } else if (labels === 'months') {\r\n return emptyLabels.map((u, i) => months[i % 12])\r\n }\r\n return emptyLabels\r\n }, [JSON.stringify(labels), dataset.length])\r\n\r\n\r\n const customTooltips = (() => {\r\n if (options && options.tooltips) {\r\n return\r\n }\r\n return {\r\n tooltips: {\r\n enabled: false,\r\n custom: cuiCustomTooltips,\r\n intersect: true,\r\n mode: 'index',\r\n position: 'nearest',\r\n callbacks: {\r\n labelColor(tooltipItem, chart) {\r\n function getValue(prop) {\r\n return typeof prop === 'object' ? prop[tooltipItem.index] : prop\r\n }\r\n\r\n const dataset = chart.data.datasets[tooltipItem.datasetIndex]\r\n //tooltipLabelColor is coreUI custom prop used only here\r\n const backgroundColor = getValue(\r\n dataset.tooltipLabelColor ||\r\n dataset.pointHoverBackgroundColor ||\r\n dataset.borderColor ||\r\n dataset.backgroundColor\r\n )\r\n return {\r\n backgroundColor\r\n }\r\n }\r\n }\r\n }\r\n }\r\n })()\r\n\r\n const computedOptions = (() => {\r\n return Object.assign({}, options, customTooltips || {})\r\n })()\r\n\r\n const chartConfig = {\r\n type,\r\n data: {\r\n datasets,\r\n labels: computedLabels\r\n },\r\n options: computedOptions,\r\n plugins\r\n }\r\n\r\n useEffect(() => {\r\n if (compData.firstRun) return\r\n updateChart()\r\n }, [chartConfig])\r\n\r\n useEffect(() => {\r\n renderChart()\r\n compData.firstRun = false\r\n return () => destroyChart()\r\n }, [])\r\n\r\n return (\r\n
    \r\n \r\n
    \r\n )\r\n}\r\n\r\nCChart.propTypes = {\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n datasets: PropTypes.array,\r\n labels: PropTypes.oneOfType([PropTypes.array, PropTypes.string]),\r\n options: PropTypes.object,\r\n plugins: PropTypes.array,\r\n type: PropTypes.string\r\n}\r\n\r\nconst CChartBar = props => \r\nconst CChartHorizontalBar = props => \r\nconst CChartLine = props => \r\nconst CChartDoughnut = props => \r\nconst CChartRadar = props => \r\nconst CChartPie = props => \r\nconst CChartPolarArea = props => \r\nconst CCharts = props => {\r\n console.warn(\r\n ' component has been deprecated. Use or instead'\r\n )\r\n return \r\n}\r\n\r\nexport {\r\n CChart,\r\n CCharts,\r\n CChartBar,\r\n CChartHorizontalBar,\r\n CChartLine,\r\n CChartDoughnut,\r\n CChartRadar,\r\n CChartPie,\r\n CChartPolarArea\r\n}\r\n\r\n"}},{"id":"4a101522-6ca2-5163-aed9-245f50ee6aa1","name":"CCol","fields":{"code":"import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport {tagPropType} from '../utils/helper.js';\r\n\r\nconst colWidths = ['xs', 'sm', 'md', 'lg', 'xl'];\r\nconst stringOrNumberProp = PropTypes.oneOfType([PropTypes.number, PropTypes.string]);\r\nconst columnProps = PropTypes.oneOfType([\r\n PropTypes.bool,\r\n PropTypes.number,\r\n PropTypes.string,\r\n PropTypes.shape({\r\n size: PropTypes.oneOfType([PropTypes.bool, PropTypes.number, PropTypes.string]),\r\n order: stringOrNumberProp,\r\n offset: stringOrNumberProp\r\n })\r\n]);\r\nconst getColumnSizeClass = (isXs, colWidth, colSize) => {\r\n if (colSize === true || colSize === '') {\r\n return isXs ? 'col' : `col-${colWidth}`;\r\n } else if (colSize === 'auto') {\r\n return isXs ? 'col-auto' : `col-${colWidth}-auto`;\r\n }\r\n return isXs ? `col-${colSize}` : `col-${colWidth}-${colSize}`;\r\n};\r\n\r\n//component - CoreUI / CCol\r\n\r\nconst CCol = props=>{\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n widths,\r\n ...attributes\r\n } = props;\r\n\r\n //render\r\n\r\n const colClasses = [];\r\n\r\n widths.forEach((colWidth, i) => {\r\n let columnProp = props[colWidth];\r\n delete attributes[colWidth];\r\n if (!columnProp && columnProp !== '') {\r\n return;\r\n }\r\n const isXs = !i;\r\n if (typeof columnProp === 'object') {\r\n const colSizeInterfix = isXs ? '-' : `-${colWidth}-`;\r\n const colClass = getColumnSizeClass(isXs, colWidth, columnProp.size);\r\n\r\n colClasses.push(classNames({\r\n [colClass]: columnProp.size || columnProp.size === '',\r\n [`order${colSizeInterfix}${columnProp.order}`]: columnProp.order || columnProp.order === 0,\r\n [`offset${colSizeInterfix}${columnProp.offset}`]: columnProp.offset || columnProp.offset === 0\r\n }));\r\n } else {\r\n const colClass = getColumnSizeClass(isXs, colWidth, columnProp);\r\n colClasses.push(colClass);\r\n }\r\n });\r\n\r\n if (!colClasses.length) {\r\n colClasses.push('col');\r\n }\r\n\r\n const classes = classNames(\r\n className,\r\n colClasses\r\n );\r\n\r\n return (\r\n \r\n );\r\n\r\n}\r\n\r\nCCol.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n xs: columnProps,\r\n sm: columnProps,\r\n md: columnProps,\r\n lg: columnProps,\r\n xl: columnProps,\r\n widths: PropTypes.array\r\n};\r\n\r\nCCol.defaultProps = {\r\n tag: 'div',\r\n widths: colWidths,\r\n};\r\n\r\nexport default CCol;\r\n"}},{"id":"cb2d4c4d-9571-5493-bba1-a27d5c0dc17d","name":"CCollapse","fields":{"code":"import React, { useState } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { Transition } from 'react-transition-group'\r\n\r\nconst getTransitionClass = s => {\r\n return s === 'entering' ? 'collapsing' : \r\n s === 'entered' ? 'collapse show' :\r\n s === 'exiting' ? 'collapsing' : 'collapse'\r\n}\r\n\r\n//component - CoreUI / CCollapse\r\nconst CCollapse = props => {\r\n\r\n const {\r\n children,\r\n className,\r\n //\r\n innerRef,\r\n show,\r\n navbar,\r\n ...attributes\r\n } = props\r\n\r\n const [height, setHeight] = useState()\r\n\r\n const onEntering = node => {\r\n setHeight(node.scrollHeight)\r\n }\r\n\r\n const onEntered = () => {\r\n setHeight(null)\r\n }\r\n\r\n const onExit = node => {\r\n setHeight(node.scrollHeight)\r\n }\r\n\r\n const onExiting = node => {\r\n const _unused = node.offsetHeight // eslint-disable-line no-unused-vars\r\n setHeight(0)\r\n }\r\n\r\n const onExited = () => {\r\n setHeight(null)\r\n }\r\n\r\n //render\r\n return (\r\n \r\n {(status) => {\r\n let collapseClass = getTransitionClass(status)\r\n const classes = classNames(\r\n className,\r\n collapseClass,\r\n navbar && 'navbar-collapse'\r\n )\r\n const style = height === null ? null : { height }\r\n return (\r\n \r\n {children}\r\n
    \r\n )\r\n }}\r\n \r\n )\r\n}\r\n\r\nCCollapse.propTypes = {\r\n children: PropTypes.oneOfType([\r\n PropTypes.arrayOf(PropTypes.node),\r\n PropTypes.node\r\n ]),\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n show: PropTypes.bool,\r\n navbar: PropTypes.bool\r\n}\r\n\r\nCCollapse.defaultProps = {\r\n show: false\r\n}\r\n\r\nexport default CCollapse\r\n"}},{"id":"8ef8cf8a-4587-5ca6-8123-9515af40d19b","name":"CContainer","fields":{"code":"import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport {tagPropType} from '../utils/helper.js';\r\n\r\n//component - CoreUI / CContainer\r\n\r\nconst CContainer = props=>{\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n fluid,\r\n ...attributes\r\n } = props;\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n fluid ? 'container-fluid' : 'container'\r\n );\r\n\r\n return (\r\n \r\n );\r\n\r\n}\r\n\r\nCContainer.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n fluid: PropTypes.bool\r\n};\r\n\r\nCContainer.defaultProps = {\r\n tag: 'div',\r\n};\r\n\r\nexport default CContainer;\r\n"}},{"id":"aa868396-0ef5-5cbd-b32b-e13569013873","name":"CCreateElement","fields":{"code":"import React, { useMemo } from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\n//component - CoreUI / CCreateElement\r\nconst CCreateElement = ({ items, components = {} }) => {\r\n const renderItem = (item, i) => {\r\n const { _tag, _children, ...rest } = item\r\n const Tag = components[_tag] || _tag\r\n const children = _children ? _children.map((child, i) => {\r\n return typeof child === 'object' ? renderItem(child, i) : child\r\n }) : ''\r\n return {children}\r\n }\r\n\r\n const generatedItems = useMemo(() => {\r\n return items && items.map((item, i) => renderItem(item, i))\r\n }, [JSON.stringify(items)])\r\n\r\n return (\r\n \r\n {generatedItems}\r\n \r\n )\r\n}\r\n\r\nCCreateElement.propTypes = {\r\n items: PropTypes.array.isRequired,\r\n components: PropTypes.object\r\n};\r\n\r\nexport default CCreateElement"}},{"id":"b47dd88a-f8f2-5e00-8181-c0c73f9597a2","name":"CDataTable","fields":{"code":"import React, { useState, useRef, useMemo } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport CPagination from '../pagination/CPagination'\r\nimport CElementCover from '../element-cover/CElementCover'\r\nimport style from './CDataTable.module.css'\r\nimport CIcon from '@coreui/icons-react'\r\nimport { cilArrowTop, cilBan } from '@coreui/icons'\r\n\r\n//component - CoreUI / CTable\r\nconst CDataTable = props => {\r\n\r\n const {\r\n //\r\n innerRef,\r\n overTableSlot,\r\n columnHeaderSlot,\r\n sortingIconSlot,\r\n columnFilterSlot,\r\n noItemsViewSlot,\r\n noItemsView,\r\n captionSlot,\r\n underTableSlot,\r\n theadTopSlot,\r\n loadingSlot,\r\n scopedSlots,\r\n loading,\r\n fields,\r\n pagination,\r\n activePage,\r\n itemsPerPage,\r\n items,\r\n sorter,\r\n header,\r\n clickableRows,\r\n columnFilter,\r\n tableFilterValue,\r\n tableFilter,\r\n addTableClasses,\r\n size,\r\n dark,\r\n striped,\r\n hover,\r\n border,\r\n outlined,\r\n responsive,\r\n footer,\r\n itemsPerPageSelect,\r\n sorterValue,\r\n columnFilterValue,\r\n onRowClick,\r\n onSorterValueChange,\r\n onPaginationChange,\r\n onColumnFilterChange,\r\n onPagesChange,\r\n onTableFilterChange,\r\n onPageChange,\r\n onFilteredItemsChange\r\n } = props\r\n\r\n const compData = useRef(\r\n { firstRun: true, columnFiltered: 0, changeItems: 0 }).current\r\n\r\n\r\n //\r\n const [perPageItems, setPerPageItems] = useState(itemsPerPage)\r\n const [sorterState, setSorterState] = useState(sorterValue || {})\r\n const [tableFilterState, setTableFilterState] = useState(tableFilterValue)\r\n const [columnFilterState, setColumnFilterState] = useState(columnFilterValue || {})\r\n const [page, setPage] = useState(activePage || 1)\r\n const [passedItems, setPassedItems] = useState(items || [])\r\n\r\n // functions\r\n\r\n const cellClass = (item, colName, index) => {\r\n let classes = []\r\n if (item._cellClasses && item._cellClasses[colName]) {\r\n classes.push(item._cellClasses[colName])\r\n }\r\n if (fields && fields[index]._classes) {\r\n classes.push(fields[index]._classes)\r\n }\r\n return classes\r\n }\r\n\r\n const pretifyName = (name)=>{\r\n return name.replace(/[-_.]/g, ' ')\r\n .replace(/ +/g, ' ')\r\n .replace(/([a-z0-9])([A-Z])/g, '$1 $2')\r\n .split(' ')\r\n .map(word => word.charAt(0).toUpperCase() + word.slice(1))\r\n .join(' ')\r\n }\r\n\r\n const headerClass = i => fields && fields[i]._classes && fields[i]._classes\r\n\r\n const isSortable = i => sorter && fields && fields[i].sorter !== false\r\n\r\n const headerStyles = (index) => {\r\n let style = { verticalAlign: 'middle', overflow: 'hidden' }\r\n if (isSortable(index)) {\r\n style.cursor='pointer'\r\n }\r\n if (fields && fields[index] && fields[index]._style) {\r\n return {...style, ...fields[index]._style}\r\n }\r\n return style\r\n }\r\n\r\n const getIconState = index => {\r\n const direction = sorterState.asc ? 'asc' : 'desc'\r\n return rawColumnNames[index] === sorterState.column ? direction : 0\r\n }\r\n\r\n const iconClasses = index => {\r\n const state = getIconState(index)\r\n return [\r\n 'position-absolute', style['icon-transition'], style['arrow-position'],\r\n !state && style['transparent'],\r\n state === 'desc' && style['rotate-icon']\r\n ]\r\n }\r\n\r\n const rowClicked = (item, index, e, detailsClick = false) => {\r\n onRowClick && onRowClick(item, index, getClickedColumnName(e, detailsClick), e)\r\n }\r\n\r\n const changeSort = (column, index) => {\r\n if (!isSortable(index)) {\r\n return\r\n }\r\n //if column changed or sort was descending change asc to true\r\n const state = sorterState\r\n const columnRepeated = state.column === column\r\n if (!sorter || !sorter.resetable) {\r\n state.column = column\r\n } else {\r\n state.column = columnRepeated && state.asc === false ? null : column\r\n }\r\n state.asc = !(columnRepeated && state.asc)\r\n setSorterState({...state})\r\n onSorterValueChange && onSorterValueChange(sorterState)\r\n }\r\n\r\n const paginationChange = e => {\r\n onPaginationChange && onPaginationChange(Number(e.target.value))\r\n !itemsPerPageSelect.external && setPerPageItems(Number(e.target.value))\r\n }\r\n\r\n const columnFilterEvent = (colName, value, type)=>{\r\n const isLazy = columnFilter && columnFilter.lazy === true\r\n if (isLazy && type === 'input' || !isLazy && type === 'change') {\r\n return\r\n }\r\n const newState = {...columnFilterState, [`${colName}`]: value }\r\n setColumnFilterState(newState)\r\n onColumnFilterChange && onColumnFilterChange(newState)\r\n }\r\n\r\n const tableFilterChange = (value, type) => {\r\n const isLazy = tableFilter && tableFilter.lazy === true\r\n if (isLazy && type === 'input' || !isLazy && type === 'change') {\r\n return\r\n }\r\n setTableFilterState(value)\r\n onTableFilterChange && onTableFilterChange(value)\r\n }\r\n\r\n const getClickedColumnName = (e, detailsClick) => {\r\n if (detailsClick) {\r\n return 'details'\r\n } else {\r\n const children = Array.from(e.target.closest('tr').children)\r\n const clickedCell = children.filter(child => child.contains(e.target))[0]\r\n return rawColumnNames[children.indexOf(clickedCell)]\r\n }\r\n }\r\n\r\n // computed\r\n\r\n const generatedColumnNames = (() => {\r\n return Object.keys(passedItems[0] || {}).filter(el => el.charAt(0) !== '_')\r\n })()\r\n\r\n const rawColumnNames = (()=>{\r\n if (fields) {\r\n return fields.map(el => el.key || el)\r\n }\r\n return generatedColumnNames\r\n })()\r\n\r\n useMemo(() => {\r\n compData.columnFiltered++\r\n }, [\r\n JSON.stringify(columnFilter),\r\n JSON.stringify(columnFilterState),\r\n rawColumnNames.join(''),\r\n compData.changeItems\r\n ])\r\n\r\n const columnFiltered = useMemo(()=>{\r\n let items = passedItems\r\n if (columnFilter && columnFilter.external) {\r\n return items\r\n }\r\n Object.entries(columnFilterState).forEach(([key, value]) => {\r\n const columnFilter = String(value).toLowerCase()\r\n if (columnFilter && rawColumnNames.includes(key)) {\r\n items = items.filter(item => {\r\n return String(item[key]).toLowerCase().includes(columnFilter)\r\n })\r\n }\r\n })\r\n return items\r\n }, [compData.columnFiltered])\r\n\r\n const tableFiltered = useMemo(()=>{\r\n let items = columnFiltered\r\n if (!tableFilterState || (tableFilter && tableFilter.external)) {\r\n return items\r\n }\r\n const filter = tableFilterState.toLowerCase()\r\n const hasFilter = (item) => String(item).toLowerCase().includes(filter)\r\n items = items.filter(item => {\r\n return rawColumnNames.filter(key => hasFilter(item[key])).length\r\n })\r\n return items\r\n }, [\r\n compData.columnFiltered,\r\n tableFilterState,\r\n JSON.stringify(tableFilter)\r\n ])\r\n\r\n const sortedItems = useMemo(() => {\r\n const col = sorterState.column\r\n if (!col || !rawColumnNames.includes(col) || sorter.external) {\r\n onFilteredItemsChange && onFilteredItemsChange(tableFiltered)\r\n return tableFiltered\r\n }\r\n //if values in column are to be sorted by numeric value they all have to be type number\r\n const flip = sorterState.asc ? 1 : -1\r\n const sorted = tableFiltered.slice().sort((item, item2) => {\r\n const value = item[col]\r\n const value2 = item2[col]\r\n const a = typeof value === 'number' ? value : String(value).toLowerCase()\r\n const b = typeof value2 === 'number' ? value2 : String(value2).toLowerCase()\r\n return a > b ? 1 * flip : b > a ? -1 * flip : 0\r\n })\r\n !compData.firstRun && onFilteredItemsChange && onFilteredItemsChange(tableFiltered)\r\n return sorted\r\n }, [\r\n JSON.stringify(tableFiltered), \r\n JSON.stringify(sorterState), \r\n JSON.stringify(sorter)\r\n ])\r\n\r\n const tableClasses = [\r\n 'table',\r\n {\r\n [`table-${size}`]: size,\r\n 'table-dark': dark,\r\n 'table-striped': striped,\r\n 'table-hover': hover,\r\n 'table-bordered': border,\r\n 'border': outlined\r\n },\r\n addTableClasses\r\n ]\r\n\r\n\r\n const columnNames = useMemo(() => {\r\n if (fields) {\r\n return fields.map(f => {\r\n return f.label !== undefined ? f.label : pretifyName(f.key || f)\r\n })\r\n }\r\n return rawColumnNames.map(el => pretifyName(el))\r\n }, [fields, rawColumnNames])\r\n\r\n const sortingIconStyles = sorter && 'position-relative pr-4'\r\n\r\n const colspan = rawColumnNames.length\r\n\r\n const totalPages = Math.ceil((sortedItems.length) / perPageItems) || 1\r\n useMemo(() => {\r\n !compData.firstRun && onPagesChange && onPagesChange(totalPages)\r\n }, [totalPages])\r\n\r\n const computedPage = useMemo(() => {\r\n const compPage = pagination ? page : activePage\r\n !compData.firstRun && onPageChange && onPageChange(compPage)\r\n return compPage\r\n }, [page, activePage, pagination])\r\n\r\n const firstItemIndex = (computedPage - 1) * perPageItems || 0\r\n\r\n const paginatedItems = sortedItems.slice(\r\n firstItemIndex,\r\n firstItemIndex + perPageItems\r\n )\r\n const currentItems = computedPage ? paginatedItems : sortedItems\r\n\r\n const tableFilterData = {\r\n label: (tableFilter && tableFilter.label) || 'Filter:',\r\n placeholder: (tableFilter && tableFilter.placeholder) || 'type string...'\r\n }\r\n\r\n const paginationSelect = {\r\n label: (itemsPerPageSelect && itemsPerPageSelect.label) || 'Items per page:',\r\n values: (itemsPerPageSelect && itemsPerPageSelect.values) || [5, 10, 20, 50]\r\n }\r\n\r\n const noItemsText = (() => {\r\n const customValues = noItemsView || {}\r\n if (passedItems.length) {\r\n return customValues.noResults || 'No filtering results'\r\n }\r\n return customValues.noItems || 'No items'\r\n })()\r\n\r\n // watch\r\n useMemo(() => setPerPageItems(itemsPerPage), [itemsPerPage])\r\n\r\n useMemo(() => setSorterState({ ...sorterValue }), [sorterValue])\r\n\r\n useMemo(() => setTableFilterState(tableFilterValue), [tableFilterValue])\r\n\r\n useMemo(() => setColumnFilterState({...columnFilterValue}), [columnFilterValue])\r\n\r\n //items\r\n useMemo(() => {\r\n if (\r\n items &&\r\n !compData.firstRun &&\r\n (items.length !== passedItems.length ||\r\n JSON.stringify(items) !== JSON.stringify(passedItems))\r\n ) {\r\n setPassedItems(items)\r\n compData.changeItems++\r\n }\r\n })\r\n\r\n\r\n\r\n // render\r\n compData.firstRun = false\r\n\r\n const paginationProps = typeof pagination === 'object' ? pagination : null\r\n\r\n const headerContent = (\r\n \r\n {\r\n columnNames.map((name, index)=>{\r\n return (\r\n {changeSort(rawColumnNames[index], index)}}\r\n className={classNames([headerClass(index), sortingIconStyles])}\r\n style={headerStyles(index)}\r\n key={index}\r\n >\r\n { columnHeaderSlot[`${rawColumnNames[index]}`] ||\r\n
    {name}
    \r\n }\r\n {\r\n isSortable(index) &&\r\n ((sortingIconSlot && sortingIconSlot(getIconState(index), iconClasses(index))) ||\r\n )\r\n }\r\n \r\n )\r\n })\r\n }\r\n )\r\n\r\n return (\r\n\r\n
    \r\n {\r\n (itemsPerPageSelect || tableFilter) &&\r\n
    \r\n {\r\n tableFilter &&\r\n
    \r\n \r\n {tableFilterChange(e.target.value, 'input')}}\r\n onChange={(e)=>{tableFilterChange(e.target.value, 'change')}}\r\n value={tableFilterState || ''}\r\n />\r\n
    \r\n }\r\n {\r\n itemsPerPageSelect &&\r\n
    \r\n
    \r\n \r\n \r\n \r\n { paginationSelect.values.map((number, key)=>{\r\n return (\r\n \r\n {number}\r\n \r\n )\r\n })}\r\n \r\n
    \r\n
    \r\n }\r\n
    \r\n }\r\n
    \r\n\r\n{ overTableSlot }\r\n\r\n
    \r\n \r\n \r\n { theadTopSlot }\r\n { header && headerContent }\r\n {\r\n columnFilter && \r\n {\r\n rawColumnNames.map((colName, index)=>{\r\n return (\r\n \r\n )\r\n })\r\n }\r\n \r\n }\r\n \r\n \r\n { currentItems.map((item, itemIndex) => {\r\n return (\r\n \r\n {rowClicked(item, itemIndex + firstItemIndex, e)}}\r\n >\r\n {\r\n rawColumnNames.map((colName, index)=>{\r\n return (\r\n scopedSlots[colName] &&\r\n React.cloneElement(\r\n scopedSlots[colName](item, itemIndex + firstItemIndex),\r\n {'key': index}\r\n )\r\n ) ||\r\n \r\n { String(item[colName]) }\r\n \r\n })\r\n }\r\n \r\n {\r\n scopedSlots.details &&\r\n {rowClicked(item, itemIndex + firstItemIndex, e, true)}}\r\n className=\"p-0\"\r\n style={{border: 'none !important'}}\r\n key={'details' + itemIndex}\r\n >\r\n \r\n { scopedSlots.details(item, itemIndex + firstItemIndex) }\r\n \r\n \r\n }\r\n \r\n )\r\n })}\r\n {\r\n !currentItems.length &&\r\n \r\n \r\n \r\n }\r\n \r\n { footer && currentItems.length > 0 && {headerContent}}\r\n { captionSlot }\r\n
    \r\n { columnFilterSlot[`${rawColumnNames[index]}`] ||\r\n ( fields && fields[index].filter !== false &&\r\n {columnFilterEvent(colName, e.target.value, 'input')}}\r\n onChange={(e)=>{columnFilterEvent(colName, e.target.value, 'change')}}\r\n value={columnFilterState[colName] || ''}\r\n />)\r\n }\r\n
    \r\n { noItemsViewSlot ||\r\n
    \r\n

    \r\n { noItemsText }\r\n \r\n

    \r\n
    }\r\n
    \r\n { loading && \r\n (loadingSlot || \r\n )\r\n }\r\n
    \r\n\r\n{ underTableSlot }\r\n\r\n{ pagination &&\r\n 0 ? 'inline' : 'none'}}\r\n onActivePageChange={(page) => { setPage(page) }}\r\n pages={totalPages}\r\n activePage={page}\r\n />\r\n}\r\n    \r\n )\r\n}\r\n\r\nCDataTable.propTypes = {\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n overTableSlot: PropTypes.node,\r\n columnHeaderSlot: PropTypes.object,\r\n sortingIconSlot: PropTypes.func,\r\n columnFilterSlot: PropTypes.object,\r\n noItemsViewSlot: PropTypes.node,\r\n noItemsView: PropTypes.object,\r\n captionSlot: PropTypes.node,\r\n underTableSlot: PropTypes.node,\r\n scopedSlots: PropTypes.object,\r\n theadTopSlot: PropTypes.node,\r\n loadingSlot: PropTypes.node,\r\n loading: PropTypes.bool,\r\n fields: PropTypes.array,\r\n pagination: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),\r\n activePage: PropTypes.number,\r\n itemsPerPage: PropTypes.number,\r\n items: PropTypes.array,\r\n sorter: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),\r\n clickableRows: PropTypes.bool,\r\n columnFilter: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),\r\n tableFilterValue: PropTypes.string,\r\n tableFilter: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),\r\n addTableClasses: PropTypes.oneOfType([PropTypes.string, PropTypes.array, PropTypes.object]),\r\n size: PropTypes.string,\r\n dark: PropTypes.bool,\r\n striped: PropTypes.bool,\r\n hover: PropTypes.bool,\r\n border: PropTypes.bool,\r\n outlined: PropTypes.bool,\r\n responsive: PropTypes.bool,\r\n footer: PropTypes.bool,\r\n itemsPerPageSelect: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),\r\n sorterValue: PropTypes.object,\r\n columnFilterValue: PropTypes.object,\r\n header: PropTypes.bool,\r\n onRowClick: PropTypes.func,\r\n onSorterValueChange: PropTypes.func,\r\n onPaginationChange: PropTypes.func,\r\n onColumnFilterChange: PropTypes.func,\r\n onPagesChange: PropTypes.func,\r\n onTableFilterChange: PropTypes.func,\r\n onPageChange: PropTypes.func,\r\n onFilteredItemsChange: PropTypes.func\r\n}\r\n\r\nCDataTable.defaultProps = {\r\n itemsPerPage: 10,\r\n responsive: true,\r\n columnHeaderSlot: {},\r\n columnFilterSlot: {},\r\n scopedSlots: {},\r\n sorterValue: {},\r\n header: true\r\n}\r\n\r\nexport default CDataTable\r\n"}},{"id":"949e00ab-b054-51ab-872f-522cb53d2270","name":"CDropdown","fields":{"code":"import React, { useState } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\n\r\nexport const Context = React.createContext({})\r\n\r\n//component - CoreUI / CDropdown\r\n\r\nconst CDropdown = props => {\r\n\r\n const {\r\n className,\r\n tag,\r\n //\r\n innerRef,\r\n inNav,\r\n ...attributes\r\n } = props\r\n\r\n\r\n const [reference, setReference] = useState()\r\n const [isOpen, setIsOpen] = useState()\r\n const [split, setSplit] = useState()\r\n const [placement, setPlacement] = useState('')\r\n\r\n const carretClass = placement.includes('top') ? 'dropup' :\r\n placement.includes('right') ? 'dropright' :\r\n placement.includes('left') ? 'dropleft' : 'dropdown'\r\n\r\n const Tag = tag || (inNav ? 'li' : 'div')\r\n const classes = classNames(\r\n className,\r\n carretClass,\r\n { 'nav-item': inNav, 'btn-group': split, 'show': isOpen }\r\n )\r\n\r\n\r\n return (\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nCDropdown.propTypes = {\r\n tag: tagPropType,\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n inNav: PropTypes.bool\r\n}\r\n\r\nexport default CDropdown\r\n"}},{"id":"d326a693-ae8e-5ec1-93f6-b3a6764fdd95","name":"CDropdownDivider","fields":{"code":"import React from 'react'\r\nimport CDropdownItem from './CDropdownItem'\r\n\r\n//component - CoreUI / CDropdownDivider\r\n\r\nconst CDropdownDivider = props => {\r\n\r\n return (\r\n \r\n )\r\n}\r\n\r\nexport default CDropdownDivider"}},{"id":"dbc02722-d78b-5814-97ec-27ea10df5c52","name":"CDropdownHeader","fields":{"code":"import React from 'react'\r\nimport CDropdownItem from './CDropdownItem'\r\n\r\n//component - CoreUI / CDropdownHeader\r\n\r\nconst CDropdownHeader = props => {\r\n\r\n return (\r\n \r\n )\r\n}\r\n\r\nexport default CDropdownHeader\r\n"}},{"id":"89448d1a-5c1f-5d35-bd43-ce1d1740c3ca","name":"CDropdownItem","fields":{"code":"import React, { useContext } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\nimport { Context } from './CDropdown'\r\nimport CLink from '../link/CLink'\r\n\r\n//component - CoreUI / CDropdownItem\r\nconst CDropdownItem = props => {\r\n\r\n let {\r\n tag,\r\n className,\r\n //\r\n innerRef,\r\n onClick,\r\n color,\r\n divider,\r\n header,\r\n active,\r\n disabled,\r\n ...rest\r\n } = props\r\n\r\n const { setIsOpen } = useContext(Context)\r\n\r\n const isItem = !(header || divider)\r\n\r\n const click = e => {\r\n if (disabled) {\r\n return\r\n }\r\n onClick && onClick(e)\r\n isItem && setIsOpen(false)\r\n }\r\n\r\n //render\r\n const tabIndex = isItem && !disabled ? null : -1\r\n const role = tabIndex === null ? 'menuitem' : undefined\r\n const Tag = tag || (!isItem ? 'div' : CLink)\r\n const ref = { [`${typeof Tag === 'string' ? 'ref': 'innerRef'}`]: innerRef }\r\n\r\n const classes = classNames(\r\n className,\r\n 'dropdown-' + (header ? 'header' : divider ? 'divider' : 'item'),\r\n { active },\r\n color && 'bg-' + color,\r\n disabled && Tag !== CLink && 'disabled'\r\n )\r\n\r\n\r\n\r\n return (\r\n \r\n )\r\n}\r\n\r\nCDropdownItem.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n color: PropTypes.string,\r\n divider: PropTypes.bool,\r\n header: PropTypes.bool,\r\n disabled: PropTypes.bool,\r\n onClick: PropTypes.func,\r\n active: PropTypes.bool\r\n}\r\n\r\nexport default CDropdownItem\r\n"}},{"id":"562d7a3b-7956-5fc3-aafb-c9c179e35441","name":"CDropdownMenu","fields":{"code":"import React, { useState, useEffect, useLayoutEffect, useContext } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { Context } from './CDropdown'\r\nimport { createPopper } from '@popperjs/core'\r\n\r\n//component - CoreUI / CDropdownMenu\r\n\r\n\r\nconst CDropdownMenu = props => {\r\n\r\n const {\r\n className,\r\n show,\r\n placement,\r\n modifiers,\r\n innerRef,\r\n ...rest\r\n } = props\r\n\r\n const { reference, isOpen, setIsOpen, setPlacement } = useContext(Context)\r\n const [popperElement, setPopperElement] = useState(null)\r\n const [popper, setPopper] = useState(null)\r\n\r\n innerRef && innerRef(popperElement)\r\n\r\n useEffect(() => {\r\n setIsOpen(show)\r\n setPlacement(placement)\r\n }, [show, placement])\r\n\r\n const classes = classNames(\r\n className,\r\n 'dropdown-menu',\r\n {\r\n 'show': isOpen,\r\n }\r\n )\r\n\r\n useLayoutEffect(() => {\r\n if (!reference) {\r\n return\r\n }\r\n setPopper(createPopper(\r\n reference,\r\n popperElement,\r\n {\r\n placement,\r\n modifiers: modifiers || []\r\n }\r\n ))\r\n \r\n return () => {\r\n if (popper) {\r\n popper.destroy()\r\n }\r\n }\r\n }, [isOpen])\r\n\r\n const checkClose = (e) => {\r\n if ([reference, popperElement].every(el => !el.contains(e.target))) {\r\n setIsOpen(false)\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if (isOpen) {\r\n document.addEventListener('click', checkClose)\r\n }\r\n return () => document.removeEventListener('click', checkClose)\r\n }, [isOpen])\r\n\r\n return (\r\n \r\n )\r\n}\r\n\r\n\r\nCDropdownMenu.propTypes = {\r\n children: PropTypes.node.isRequired,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n modifiers: PropTypes.array,\r\n show: PropTypes.bool,\r\n placement: PropTypes.oneOf([\r\n '', 'top-end', 'top', 'top-start',\r\n 'bottom-end', 'bottom', 'bottom-start',\r\n 'right-start', 'right', 'right-end',\r\n 'left-start', 'left', 'left-end'\r\n ])\r\n}\r\n\r\nCDropdownMenu.defaultProps = {\r\n placement: 'bottom-start',\r\n}\r\n\r\nexport default CDropdownMenu\r\n"}},{"id":"9ee35b78-14ee-5d23-a49b-b6cc4b890c7b","name":"CDropdownToggle","fields":{"code":"import React, { useContext, useEffect } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\nimport CButton from '../button/CButton'\r\nimport CLink from '../link/CLink'\r\nimport { Context } from './CDropdown'\r\n\r\n//component - CoreUI / CDropdownToggle\r\n\r\nconst CDropdownToggle = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n onClick,\r\n caret,\r\n split,\r\n tag,\r\n ...attributes\r\n } = props\r\n\r\n const {\r\n reference,\r\n setReference,\r\n isOpen,\r\n setIsOpen,\r\n inNav,\r\n setSplit\r\n } = useContext(Context)\r\n \r\n innerRef && innerRef(reference)\r\n\r\n useEffect(() => {\r\n setSplit(split)\r\n })\r\n\r\n const click = e => {\r\n if (props.disabled) {\r\n return\r\n }\r\n onClick && onClick(e)\r\n setIsOpen(!isOpen)\r\n }\r\n\r\n const Tag = tag || (inNav ? CLink : CButton)\r\n\r\n const classes = classNames(\r\n className,\r\n {\r\n 'dropdown-toggle': caret && !split,\r\n 'nav-link': inNav\r\n }\r\n )\r\n\r\n const togglerAttrs = {\r\n onClick: click,\r\n 'aria-expanded': isOpen ? 'true' : 'false',\r\n 'aria-haspopup': 'true',\r\n 'aria-label': 'Dropdown toggle',\r\n [`${tag && typeof tag === 'string' ? 'ref' : 'innerRef'}`]: setReference\r\n }\r\n\r\n if (split) {\r\n return (\r\n \r\n \r\n {props.children}\r\n \r\n {''}\r\n \r\n )\r\n } else {\r\n return (\r\n \r\n )\r\n }\r\n}\r\n\r\nCDropdownToggle.propTypes = {\r\n tag: tagPropType,\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n caret: PropTypes.bool,\r\n onClick: PropTypes.func,\r\n split: PropTypes.bool,\r\n disabled: PropTypes.bool\r\n}\r\n\r\nCDropdownToggle.defaultProps = {\r\n caret: true\r\n}\r\n\r\nexport default CDropdownToggle\r\n"}},{"id":"e6266327-8c4f-5fa9-af9b-af4ecfa221a6","name":"CElementCover","fields":{"code":"import React, { useEffect, createRef, useState } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport CSpinner from '../spinner/CSpinner'\r\n\r\n//component - CoreUI / CElementCover\r\nconst CElementCover = props => {\r\n\r\n const {\r\n className,\r\n children,\r\n //\r\n innerRef,\r\n boundaries,\r\n opacity,\r\n ...attributes\r\n } = props\r\n\r\n const [customBoundaries, setCustomBoundaries] = useState({})\r\n const ref = createRef(null)\r\n innerRef && innerRef(ref)\r\n\r\n const getCustomBoundaries = () => {\r\n if (!ref || !ref.current || !boundaries) {\r\n return {}\r\n }\r\n const parent = ref.current.parentElement\r\n const parentCoords = parent.getBoundingClientRect()\r\n const customBoundaries = {}\r\n boundaries.forEach(({sides, query}) => {\r\n const element = parent.querySelector(query)\r\n if (!element || !sides) {\r\n return\r\n }\r\n const coords = element.getBoundingClientRect()\r\n sides.forEach(side => {\r\n const sideMargin = Math.abs(coords[side] - parentCoords[side])\r\n customBoundaries[side] = sideMargin + 'px'\r\n })\r\n })\r\n return customBoundaries\r\n }\r\n\r\n useEffect(() => {\r\n setCustomBoundaries(getCustomBoundaries())\r\n }, [JSON.stringify(getCustomBoundaries())])\r\n\r\n //render\r\n const classes = classNames(className)\r\n\r\n const containerCoords = {\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n ...customBoundaries\r\n }\r\n\r\n const coverStyles = {\r\n ...containerCoords,\r\n position: 'absolute',\r\n backgroundColor: `rgb(255,255,255,${opacity})`\r\n }\r\n\r\n return (\r\n
    \r\n { children || \r\n
    \r\n \r\n
    \r\n }\r\n
    \r\n )\r\n}\r\n\r\nCElementCover.propTypes = {\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n boundaries: PropTypes.array,\r\n opacity: PropTypes.number\r\n};\r\n\r\nCElementCover.defaultProps = {\r\n opacity: 0.4\r\n};\r\n\r\nexport default CElementCover"}},{"id":"fcfb4fe7-4d30-5a4a-9689-92215ce80be3","name":"CEmbed","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\n\r\n//component - CoreUI / CEmbed\r\n\r\nconst CEmbed = props => {\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n innerRef,\r\n //\r\n ratio,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className, 'embed-responsive', `embed-responsive-${ratio}`\r\n )\r\n\r\n return (\r\n \r\n )\r\n\r\n}\r\n\r\nCEmbed.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n ratio: PropTypes.oneOf(['21by9', '16by9', '4by3', '1by1']),\r\n};\r\n\r\nCEmbed.defaultProps = {\r\n tag: 'div',\r\n ratio: '16by9'\r\n}\r\n\r\nexport default CEmbed\r\n"}},{"id":"3357ebf6-7f5d-57ad-87b9-4ee36d1719ef","name":"CEmbedItem","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\n\r\n//component - CoreUI / CEmbedItem\r\n\r\nconst CEmbedItem = props => {\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'embed-responsive-item'\r\n )\r\n\r\n return (\r\n \r\n )\r\n\r\n}\r\n\r\nCEmbedItem.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n type: PropTypes.oneOf(['iframe', 'embed', 'video', 'object', 'img'])\r\n};\r\n\r\nCEmbedItem.defaultProps = {\r\n tag: 'iframe'\r\n}\r\n\r\nexport default CEmbedItem\r\n"}},{"id":"865d9136-bccb-54e1-9498-dbd3b862ff80","name":"CFade","fields":{"code":"import React, { useRef } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { pickByKeys, omitByKeys } from '@coreui/utils/src'\r\nimport { TransitionPropTypeKeys, tagPropType } from '../utils/helper.js'\r\nimport { Transition } from 'react-transition-group'\r\n\r\n//component - CoreUI / CFade\r\nconst CFade = props => {\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n children,\r\n //\r\n innerRef,\r\n baseClass,\r\n baseClassActive,\r\n ...rest\r\n } = props\r\n\r\n //render\r\n const transitionProps = pickByKeys(rest, TransitionPropTypeKeys)\r\n const childProps = omitByKeys(rest, TransitionPropTypeKeys)\r\n\r\n const childRef = useRef()\r\n\r\n return (\r\n \r\n {(status) => {\r\n const isActive = status === 'entered'\r\n const classes = classNames(\r\n className,\r\n baseClass,\r\n isActive && baseClassActive\r\n )\r\n return (\r\n \r\n {children}\r\n \r\n )\r\n }}\r\n \r\n )\r\n}\r\n\r\nCFade.propTypes = {\r\n tag: tagPropType,\r\n children: PropTypes.oneOfType([\r\n PropTypes.arrayOf(PropTypes.node),\r\n PropTypes.node\r\n ]),\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n baseClass: PropTypes.string,\r\n baseClassActive: PropTypes.string\r\n}\r\n\r\nCFade.defaultProps = {\r\n tag: 'div',\r\n //\r\n baseClass: 'fade',\r\n baseClassActive: 'show',\r\n timeout: 150,\r\n appear: true,\r\n enter: true,\r\n exit: true,\r\n in: true\r\n}\r\n\r\nexport default CFade\r\n"}},{"id":"d2198ab9-9e6c-51d4-992d-a340ea7faf93","name":"CFooter","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CFooter\r\nconst CFooter = props => {\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n fixed,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n const classes = classNames(\r\n 'c-footer',\r\n fixed ? 'c-footer-fixed' : null,\r\n className\r\n )\r\n\r\n return (\r\n \r\n )\r\n}\r\n\r\nCFooter.propTypes = {\r\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n fixed: PropTypes.bool\r\n};\r\n\r\nCFooter.defaultProps = {\r\n tag: 'footer',\r\n fixed: false\r\n};\r\n\r\nexport default CFooter\r\n"}},{"id":"43b57b75-26c2-5f84-92ee-5291ac93b437","name":"CForm","fields":{"code":"import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport {tagPropType} from '../utils/helper.js';\r\n\r\n//component - CoreUI / CForm\r\n\r\nconst CForm = props=>{\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n innerRef,\r\n //\r\n inline,\r\n wasValidated,\r\n ...attributes\r\n } = props;\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n inline ? 'form-inline' : false,\r\n wasValidated ? 'was-validated' : false\r\n );\r\n\r\n return (\r\n \r\n );\r\n\r\n}\r\n\r\nCForm.propTypes = {\r\n tag: tagPropType,\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n inline: PropTypes.bool,\r\n wasValidated: PropTypes.bool\r\n};\r\n\r\nCForm.defaultProps = {\r\n tag: 'form',\r\n};\r\n\r\nexport default CForm;\r\n"}},{"id":"e7455973-d80c-5d2b-87e4-bf47737f5061","name":"CFormFeedback","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CFormFeedback\r\n\r\nconst CFormFeedback = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n valid,\r\n tooltip,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n const validMode = tooltip ? 'tooltip' : 'feedback'\r\n const classes = classNames(\r\n valid ? `valid-${validMode}` : `invalid-${validMode}`,\r\n className\r\n )\r\n\r\n return
    \r\n}\r\n\r\nCFormFeedback.propTypes = {\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n valid: PropTypes.bool,\r\n tooltip: PropTypes.bool\r\n};\r\n\r\nexport const CValidFeedback = props => \r\nexport const CInvalidFeedback = props => \r\n"}},{"id":"a72d1f70-4e16-51ac-9757-f99ac109a88f","name":"CFormGroup","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CFormGroup\r\nconst CFormGroup = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n row,\r\n disabled,\r\n variant,\r\n inline,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n const checkClass = variant && variant.includes('custom') ? 'custom-control' : 'form-check'\r\n\r\n const classes = classNames(\r\n row && 'row',\r\n !variant && 'form-group',\r\n variant && checkClass,\r\n variant === 'custom-radio' && 'custom-radio',\r\n variant === 'custom-checkbox' && 'custom-checkbox',\r\n variant && inline && `${checkClass}-inline`,\r\n variant && disabled && 'disabled',\r\n className\r\n )\r\n\r\n return (\r\n
    \r\n )\r\n\r\n}\r\n\r\nCFormGroup.propTypes = {\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n row: PropTypes.bool,\r\n variant: PropTypes.oneOf(['checkbox', 'custom-checkbox', 'custom-radio']),\r\n inline: PropTypes.bool,\r\n disabled: PropTypes.bool\r\n};\r\n\r\n\r\nexport default CFormGroup\r\n"}},{"id":"7f2bc3b7-0703-5dd2-9835-abf46eef889d","name":"CFormText","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\n\r\n//component - CoreUI / CFormText\r\nconst CFormText = props => {\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n innerRef,\r\n //\r\n color,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n 'form-text', color && `text-${color}`, className\r\n )\r\n\r\n return (\r\n \r\n )\r\n\r\n}\r\n\r\nCFormText.propTypes = {\r\n tag: tagPropType,\r\n children: PropTypes.node,\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n color: PropTypes.string\r\n};\r\n\r\nCFormText.defaultProps = {\r\n tag: 'small',\r\n color: 'muted'\r\n};\r\n\r\nexport default CFormText\r\n"}},{"id":"f546debe-947b-5a94-9fda-a1a0d94f3f6d","name":"CHeader","fields":{"code":"import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\n\r\n//component - CoreUI / CHeader\r\n\r\nconst CHeader = props=>{\r\n\r\n const {\r\n tag: Tag,\r\n className,\r\n //\r\n innerRef,\r\n fixed,\r\n colorScheme,\r\n withSubheader,\r\n ...attributes\r\n } = props;\r\n\r\n // render\r\n\r\n const classes = classNames(className,\r\n 'c-header',\r\n colorScheme ? 'c-header-' + colorScheme : null,\r\n fixed ? 'c-header-fixed' : null,\r\n withSubheader ? 'c-header-with-subheader' : null);\r\n\r\n return (\r\n \r\n );\r\n\r\n}\r\n\r\nCHeader.propTypes = {\r\n tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\r\n className: PropTypes.string,\r\n children: PropTypes.node,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n fixed: PropTypes.bool,\r\n withSubheader: PropTypes.bool,\r\n colorScheme: PropTypes.string,\r\n};\r\n\r\nCHeader.defaultProps = {\r\n tag: 'header',\r\n fixed: true,\r\n colorScheme: 'light'\r\n};\r\n\r\nexport default CHeader;\r\n"}},{"id":"c01225f4-220d-5ce1-8cf5-fc83c9a127a4","name":"CHeaderBrand","fields":{"code":"/* eslint react/prop-types: 0 */\r\nimport React from 'react'\r\nimport CBrand from '../utils/CBrand'\r\n\r\n//component - CoreUI / CHeaderBrand\r\n\r\nconst CHeaderBrand = props => {\r\n return (\r\n \r\n )\r\n}\r\n\r\nexport default CHeaderBrand\r\n"}},{"id":"65536506-3af8-5cb6-9c88-e0e1ee2323d0","name":"CHeaderNav","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CHeaderNav\r\n\r\nconst CHeaderNav = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'c-header-nav'\r\n )\r\n\r\n return (\r\n
      \r\n )\r\n\r\n}\r\n\r\nCHeaderNav.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string])\r\n};\r\n\r\n\r\nexport default CHeaderNav\r\n"}},{"id":"e5ad520f-9418-5fe9-9350-f836a6984eef","name":"CHeaderNavItem","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CHeaderNavItem\r\n\r\nconst CHeaderNavItem = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n ...attributes\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'c-header-nav-item'\r\n )\r\n\r\n return (\r\n
    • \r\n )\r\n\r\n}\r\n\r\nCHeaderNavItem.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string])\r\n};\r\n\r\n\r\nexport default CHeaderNavItem"}},{"id":"52fbaec8-5d17-57a4-a3cd-5ecb03773c9e","name":"CHeaderNavLink","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport CLink from '../link/CLink'\r\n\r\n//component - CoreUI / CHeaderNavLink\r\n\r\nconst CHeaderNavLink = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n ...rest\r\n } = props\r\n\r\n //render\r\n\r\n const classes = classNames(\r\n className,\r\n 'c-header-nav-link'\r\n )\r\n\r\n return (\r\n \r\n )\r\n\r\n}\r\n\r\nCHeaderNavLink.propTypes = {\r\n className: PropTypes.string,\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string])\r\n};\r\n\r\n\r\nexport default CHeaderNavLink"}},{"id":"819e736a-b0e4-505b-8ac0-64129c8f5086","name":"CIcon","fields":{"code":"import React, { useMemo, useState } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport './CIcon.css'\r\n\r\nconst colog = (...args) => {\r\n if (process && process.env && process.env.NODE_ENV === 'development') {\r\n console.warn(...args)\r\n }\r\n}\r\n\r\nconst toCamelCase = (str) => {\r\n return str.replace(/([-_][a-z0-9])/ig, ($1) => {\r\n return $1.toUpperCase()\r\n }).replace(/-/ig, '')\r\n}\r\n\r\n//component - CoreUI / CIcon\r\nconst CIcon = props => {\r\n\r\n const {\r\n className,\r\n name,\r\n content,\r\n customClasses,\r\n size,\r\n src,\r\n title,\r\n use,\r\n ...attributes\r\n } = props\r\n\r\n const [change, setChange] = useState(0)\r\n\r\n useMemo(() => setChange(change + 1), [name, JSON.stringify[content]])\r\n\r\n const iconName = useMemo(()=>{\r\n const iconNameIsKebabCase = name && name.includes('-')\r\n return iconNameIsKebabCase ? toCamelCase(name) : name\r\n }, [change])\r\n\r\n const titleCode = title ? `${title}` : ''\r\n\r\n const code = useMemo(() => {\r\n if (content) {\r\n return content\r\n } else if (name && React.icons) {\r\n return React.icons[iconName] ? React.icons[iconName] :\r\n colog('Not existing icon: '+ iconName + ' in React.icons object')\r\n }\r\n }, [change])\r\n\r\n const iconCode = useMemo(()=>{\r\n return Array.isArray(code) ? code[1] || code[0] : code\r\n }, [change])\r\n\r\n const scale = (()=>{\r\n return Array.isArray(code) && code.length > 1 ? code[0] : '64 64'\r\n })()\r\n\r\n const viewBox = (()=>{\r\n return attributes.viewBox || `0 0 ${scale}`\r\n })()\r\n\r\n const computedSize = (()=>{\r\n const addCustom = !size && (attributes.width || attributes.height)\r\n return size === 'custom' || addCustom ? 'custom-size' : size\r\n })()\r\n\r\n //render\r\n const computedClasses = classNames(\r\n 'c-icon',\r\n computedSize && `c-icon-${computedSize}`,\r\n className\r\n )\r\n\r\n const classes = customClasses || computedClasses\r\n\r\n return (\r\n \r\n { !src && !use &&\r\n \r\n }\r\n { src && !use &&\r\n \r\n }\r\n { !src && use &&\r\n \r\n \r\n \r\n }\r\n \r\n )\r\n}\r\n\r\nCIcon.propTypes = {\r\n className: PropTypes.string,\r\n name: PropTypes.string,\r\n content: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\r\n size: PropTypes.oneOf([\r\n 'custom', 'custom-size', 'sm', 'lg', 'xl',\r\n '2xl', '3xl', '4xl', '5xl', '6xl', '7xl', '8xl', '9xl'\r\n ]),\r\n customClasses: PropTypes.oneOfType([PropTypes.string, PropTypes.array, PropTypes.object]),\r\n src: PropTypes.string,\r\n title: PropTypes.string,\r\n use: PropTypes.string\r\n}\r\n\r\nexport default CIcon\r\n\r\nexport const CIconWarn = props => {\r\n colog(\r\n '@coreui/icons-react: Please use default export since named exports are deprecated'\r\n )\r\n return \r\n}\r\n"}},{"id":"17ddea7f-296f-5e36-8705-f8334638813a","name":"CImg","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\nimport { tagPropType } from '../utils/helper.js'\r\n\r\n//component - CoreUI / CImg\r\nconst CImg = props => {\r\n\r\n const {\r\n className,\r\n //\r\n innerRef,\r\n fluid,\r\n block,\r\n thumbnail,\r\n shape,\r\n align,\r\n src,\r\n width,\r\n height,\r\n placeholderColor,\r\n fluidGrow,\r\n ...attributes\r\n } = props\r\n\r\n const alignClass = align === 'center' ? 'mx-auto' : \r\n align === 'right' ? 'float-right' :\r\n align === 'left' ? 'float-left' : ''\r\n\r\n // render\r\n const classes = classNames(\r\n className,\r\n alignClass,\r\n thumbnail && 'img-thumbnail',\r\n fluid || fluidGrow && 'img-fluid',\r\n fluidGrow && 'w-100',\r\n block && 'd-block',\r\n shape\r\n )\r\n\r\n return (\r\n src ?\r\n :\r\n \r\n )\r\n\r\n}\r\n\r\nCImg.propTypes = {\r\n tag: tagPropType,\r\n className: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\r\n //\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n src: PropTypes.string,\r\n width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\r\n height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\r\n block: PropTypes.bool,\r\n fluid: PropTypes.bool,\r\n fluidGrow: PropTypes.bool,\r\n shape: PropTypes.string,//oneOf(['', 'rounded']),\r\n thumbnail: PropTypes.bool,\r\n align: PropTypes.oneOf(['', 'left', 'right', 'center']),\r\n placeholderColor: PropTypes.string\r\n};\r\n\r\nCImg.defaultProps = {\r\n placeholderColor: 'transparent'\r\n};\r\n\r\nexport default CImg\r\n"}},{"id":"e1549f82-8b5a-5f41-b369-6225b6f68d95","name":"CInput","fields":{"code":"import React from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport classNames from 'classnames'\r\n\r\n//component - CoreUI / CInput\r\nconst commonPropTypes = {\r\n className: PropTypes.string,\r\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func, PropTypes.string]),\r\n valid: PropTypes.bool,\r\n invalid: PropTypes.bool\r\n}\r\n\r\nconst CInput = props => {\r\n\r\n let {\r\n className,\r\n //\r\n innerRef,\r\n type,\r\n valid,\r\n invalid,\r\n plaintext,\r\n size,\r\n sizeHtml,\r\n ...attributes\r\n } = props\r\n\r\n // render\r\n const classes = \r\n classNames(\r\n plaintext ? 'form-control-plaintext' : 'form-control',\r\n size && `form-control-${size}`,\r\n invalid && 'is-invalid',\r\n valid && 'is-valid',\r\n className\r\n )\r\n\r\n return \r\n}\r\n\r\nCInput.propTypes = {\r\n ...commonPropTypes,\r\n plaintext: PropTypes.bool,\r\n type: PropTypes.string,\r\n size: PropTypes.string,\r\n sizeHtml: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\r\n};\r\n\r\nCInput.defaultProps = {\r\n type: 'text'\r\n};\r\n\r\nconst CTextarea = props => {\r\n\r\n let {\r\n className,\r\n //\r\n innerRef,\r\n valid,\r\n invalid,\r\n plaintext,\r\n size,\r\n ...attributes\r\n } = props\r\n\r\n // render\r\n const classes = classNames(\r\n plaintext ? 'form-control-plaintext' : 'form-control',\r\n size && `form-control-${size}`,\r\n invalid && 'is-invalid',\r\n valid && 'is-valid',\r\n className\r\n )\r\n\r\n return